<!DOCTYPE html>
<!--[if IE 8]> <html lang="en" class="ie8 no-js"> <![endif]-->
<!--[if IE 9]> <html lang="en" class="ie9 no-js"> <![endif]-->
<!--[if !IE]><!-->
<html lang="en" class="no-js">
<!--<![endif]-->
<!-- BEGIN HEAD -->
<head>
<meta charset="utf-8">
<title>故障模拟演习</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta content="width=device-width, initial-scale=1" name="viewport">
<meta content="" name="description">
<meta content="" name="author">
<!-- BEGIN GLOBAL MANDATORY STYLES -->
<link href="../assets/global/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href="../assets/global/plugins/simple-line-icons/simple-line-icons.min.css" rel="stylesheet" type="text/css">
<link href="../assets/global/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<link href="../assets/global/plugins/uniform/css/uniform.default.css" rel="stylesheet" type="text/css">
<!-- END GLOBAL MANDATORY STYLES -->
<!-- BEGIN PAGE STYLES -->
<link href="../assets/admin/pages/css/tasks.css" rel="stylesheet" type="text/css"/>
<!-- END PAGE STYLES -->
<!-- BEGIN THEME STYLES -->
<!-- DOC: To use 'rounded corners' style just load 'components-rounded.css' stylesheet instead of 'components.css' in the below style tag -->
<link href="../assets/global/css/components-rounded.css" id="style_components" rel="stylesheet" type="text/css">
<link href="../assets/global/css/plugins.css" rel="stylesheet" type="text/css">
<link href="../assets/admin/layout3/css/layout.css" rel="stylesheet" type="text/css">
<link href="../assets/admin/layout3/css/themes/default.css" rel="stylesheet" type="text/css" id="style_color">
<link href="../assets/admin/layout3/css/custom.css" rel="stylesheet" type="text/css">
<!-- END THEME STYLES -->
<link rel="shortcut icon" href="logo.png">
<style>
	[v-cloak]{
		display: none;
	}
</style>
</head>
<!-- END HEAD -->
<!-- BEGIN BODY -->
<body>

<div id="app">
	<!-- BEGIN PAGE CONTAINER -->
	<div class="page-container" v-cloak>
		<!-- BEGIN PAGE CONTENT -->
		<div class="page-content">
			<div class="container">
				<!-- BEGIN PAGE CONTENT INNER -->
				<div class="row">
					<div class="col-md-12">
						<!-- BEGIN PORTLET-->
						<div class="portlet light tasks-widget simulate">
							<div class="portlet-title tabbable-line">
								<div class="caption caption-md">
									<i class="icon-globe theme-font hide"></i>
									<span class="caption-subject theme-font bold uppercase">模拟演习</span>
								</div>
							</div>
							<div class="portlet-body">
								<form role="form">
									<div class="form-body">
										<div class="form-group">
											<label class="font-sm font-grey-mint">选择模拟故障的线路</label>
											<select class="form-control" v-model="link.linkId">
												<option v-for="(el,lid) in links" v-bind:value="el.linkId" v-text="el.linkName"></option>
											</select>
										</div>
										
										<div class="form-group">
											<label class="font-sm font-grey-mint">输入模拟故障点距起点的距离（米）</label>
											<input class="form-control" type="text" placeholder="请输入" v-model="link.statusValue">
										</div>
										<div class="form-group">
											<label class="font-sm font-grey-mint">故障类型</label>
											<select class="form-control" v-model="link.status">
												<option>中断</option>
												<option>衰减</option>
											</select>
										</div>
									</div>
									<div class="form-group">
										<a href="GZGJ0.html" type="submit" class="btn blue btn-block" @click="toRun($event)">模拟演习</a>
									</div>
								</form>
							</div>
							</div>
						</div>
						<!-- END PORTLET-->
					</div>
				</div>
				
				<!-- END PAGE CONTENT INNER -->
			</div>
		</div>
		<!-- END PAGE CONTENT -->
	</div>

	<!-- END PAGE CONTAINER -->
</div>
<!-- BEGIN JAVASCRIPTS (Load javascripts at bottom, this will reduce page load time) -->
<!-- BEGIN CORE PLUGINS -->

<script src="assets/global/plugins/jquery.min.js" type="text/javascript"></script>
<script src="assets/layer/layer.js" type="text/javascript"></script>
<script src="assets/js/vue.js"></script>
<script src="assets/js/axios.min.js"></script>
<script src="assets/js/xlsx.full.min.js"></script>
<script src="assets/js/config.js"></script>
<script>
jQuery(document).ready(function() {
	const {createApp} = Vue;
	const app = createApp({
		data(){
			return {
				links:[],
				selected:0,
				link:{
					linkId:0,
					linkName:"",
					status:"中断",
					statusValue:"",

				}
			}
		},
		methods:{
			async load(){
				layer.load(0,{msg:"努力加载中，请稍后..."});
				axios.post(config.getUrl() + "/getLinks",{}).then(res => {
					if(res.status == 200){
						console.log(res);
						if(res.data.code == 0){
							layer.closeAll()
							if(res.data.data instanceof Array || res.data.data.lenght > 0){
								this.links = res.data.data;
							}
						}else{
							layer.closeAll();
							layer.alert("获取链路失败，代码为：" + res.data.msg,{icon:1,time:3000});
							try {
								console.log(aaa);
							} catch (error) {
								console.log(error);
							}
						}
					}else{
						layer.closeAll();
						layer.alert("网络连接失败，请联系管理员",{icon:1,time:3000});
						try {
							console.log(aaa);
						} catch (error) {
							console.log(error);
						}
					}
				}).then(res => {
					console.log("bbb");
					if(this.links.length > 0){
						console.log("ccc");
						this.link.linkId = this.links[0]['linkId']
						console.log(this.link);
					}
				})
			},
			toRun(e){
				e.preventDefault()
				console.log(this.link);
				layer.load(0,{msg:"努力加载中，请稍后..."});
				this.link.gaojingType = 0;
				axios.post(config.getUrl() + "/saveGaojing",this.link).then(res => {
					try {
						if(res.status == 200){
							console.log(res);
							if(res.data.code == 0){
								layer.closeAll();
								return res.data;
								layer.alert(res.data.msg,{icon:1,time:3000});
								//window.location.href = `${config.baseUrl}/gzgj?linkId=${this.link.linkId}`
							}else{
								layer.closeAll();
								layer.alert("获取链路失败，代码为：" + res.data.msg,{icon:1,time:3000});
								try {
									console.log(aa);
								} catch (error) {
									console.log(error);
								}
								
							}
						}else{
							layer.closeAll();
							try {
								console.log(aa);
							} catch (error) {
								console.log(error);
							}
							layer.alert("网络连接失败，请联系管理员",{icon:1,time:3000});
						}
					} catch (error) {
						console.log(error);
					}
					
				}).then(res => {
					try {
						layer.load(0,{msg:"努力加载中，请稍后..."});
						axios.post(config.getUrl() + "/setAlarm",res.data).then(rs => {
							if(rs.status == 200){
								if(rs.data.code == 0){
									console.log(res.data);
									//window.open(`http://127.0.0.1:5500/gzgj?gaojingId=${res.data.gaojing.gaojingId}`)
									window.location.href = `${config.baseUrl}/mnyxing`
									layer.closeAll();
								}else{
									layer.closeAll();
								}
							}else{
								layer.closeAll();
								try {
									console.log(aa);
								} catch (error) {
									console.log(error);
								}
								layer.alert("网络连接失败，请联系管理员",{icon:1,time:3000});
							}
						})
					} catch (error) {
						console.log(error);
					}
					
				})
				/* axios.post(config.getUrl() + "/setHitch",this.link).then(res => {
					if(res.status == 200){
						if(res.data.code == 0){
							layer.closeAll();
							layer.alert(res.data.msg,{icon:1,time:3000});
							window.location.href = `${config.baseUrl}/gzgj?linkId=${this.link.linkId}`
						}else{
							layer.closeAll();
							layer.alert("获取链路失败，代码为：" + res.data.msg,{icon:1,time:3000});
						}
					}else{
						layer.closeAll();
						layer.alert("网络连接失败，请联系管理员",{icon:1,time:3000});
					}
				}) */
			}
		},
		created(){
			this.load()
		},
		watch:{
			"link.linkId":{
				handler(nv,old){
					console.log(nv);
					if(this.links.length > 0){
						for(var i=0;i<this.links.length;i++){
							if(nv == this.links[i]['linkId']){
								this.link.linkName = this.links[i]['linkName'];
								this.link.lineName = this.links[i]["lineName"];
								this.link.times = this.links[i]["times"];
								this.link.cancat = this.links[i]["cancat"];
								this.link.works = JSON.parse(this.links[i]["works"]);
							}
						}
					}
				},
				immediate:true,
				deep:true
			}
		}
	})
	app.mount("#app")
})
</script>
<!-- END JAVASCRIPTS -->
</body>
<!-- END BODY -->
</html>